<template>
  <div class="info-modal">
    <div class="date-filter" @click="popupShow">
      <i :class="icon?icon:'zhk-list_analyze'"></i>
    </div>
    <InfoModalPopup v-if="popupVisible" :infoTitle="infoTitle" :ctUnli="ctUnli" :infoText="infoText" v-on:listenToInfoModalPopupHide="popupHide"  />
  </div>
</template>

<script>
import Vue from "vue";
import { DatetimePicker, Popup } from "mint-ui";
import InfoModalPopup from "../InfoModalPopup/InfoModalPopup";
Vue.component(DatetimePicker.name, DatetimePicker);
Vue.component(Popup.name, Popup);
export default {
  name: "InfoModal",
  data() {
    return {
      popupVisible: false
    };
  },
  props: {
    infoText: {
      type: Array
    },
    infoTitle: {
      type: String
    },
    ctUnli: {
      type: String
    },
    icon: {
      type: String
    }
  },
  mounted() {},
  methods: {
    popupShow() {
      this.popupVisible = true;
    },
    popupHide() {
      this.popupVisible = false;
    }
  },
  components: {
	  InfoModalPopup,
  }
};
</script>

<style lang="scss" scoped>
@import "InfoModal";
</style>
